var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");

var time;
var int;

var a=20
var mineNum=9;
var maxRow =10;
var maxCol=10;
var blocks=[]
var block={value:0,state:'0',row:0,col:0}
var minesIndex=[]
var markFlag=true;

//游戏开始
var start=function(){
    //计时器启动
    time = 0;
    clearInterval(int);
    int=setInterval(function(){
        time+=1;
        document.getElementById("timer_span").innerHTML=time;
    },1000);
    //以下开始初始化
    //生成所有的雷
    for(var i=0;i<mineNum;i++){
        randomMine()
    }
    //生成所有的块，没有雷的块value=0
    for(var i=0 ;i< maxRow;i++){
        for(var j=0 ;j< maxCol;j++){
            var value=0;
            if(minesIndex.indexOf(i*maxCol+j)!=-1){
                value=-1
            }
            var block={value:value,state:'0',row:i,col:j}
            blocks.push(block);
        }
    }
    calculate()
    //画出所有的雷
    for(var i=0;i<blocks.length;i++){
        drawBlock(blocks[i].row,blocks[i].col,"0")
    }
}
//随机生成一个雷
var randomMine = function(){
    var index = parseInt(Math.random()*(maxRow*maxCol))
    if(minesIndex.indexOf(index)==-1){
        minesIndex.push(index)
    }else{
        randomMine()
    }
}

//计算没有雷的块周围雷的个数（value值）
var calculate=function(){
    for(var i=0 ;i< maxRow;i++) {
        for (var j = 0; j < maxCol; j++) {
            var num=0;
            var block=blocks[i*maxCol+j]
            var row=block.row
            var col=block.col
            var row3=[row-1,row,row+1]
            var col3=[col-1,col,col+1]
            if(block.value==-1)continue;
            for(var x=0;x<row3.length;x++){
                if(row3[x]<0||row3[x]>=maxRow)continue;
                for(var y=0;y<col3.length;y++){
                    if(col3[y]<0||col3[y]>=maxCol)continue;
                    if(row3[x]==row&&col3[y]==col)continue;
                    var block2=blocks[row3[x]*maxCol+col3[y]]
                    if(block2.value==-1)num++;
                }
            }
            block.value=num;
        }
    }
}
//画
var drawImg=function(src,x,y){
    var img = new Image()
    img.onload=function(){
        context.drawImage(img,x,y);
    };
    img.src=src;
}
var drawBlock = function(row,col,state){
    var block = blocks[row*maxCol+col];
    var value = block.value;
    //if(block.value==0)return;
    var x = row*a
    var y = col*a
    switch (state){
        case "2":
            drawImg('image/flag.jpg',x,y);
            break;
        case "3":
            drawImg('image/flag2.jpg',x,y);
            break;
        case "11":
            drawImg('image/bomb0.jpg',x,y);
            break;
        case "1":
            if(value==-1){
                drawImg('image/bomb.jpg',x,y);
            }else{
                drawImg('image/'+value+'.jpg',x,y);
            }
            break;
        default:
            drawImg('image/s.jpg',x,y);
            break;
    }
}

var leftClick=function(row,col){
    var block=blocks[row*maxCol+col]
    if(block.state!='0'){
        return;
    }
    if(block.value==-1){
        console.log('游戏结束')
        for(var i=0;i<blocks.length;i++){
            drawBlock(blocks[i].row,blocks[i].col,"1")
        }
        drawBlock(row,col,'11')
        return;
    }else{
        block.state='1'
        drawBlock(row,col,'1');
        if(block.value==0){
            //循环周围8个块，依次执行左键单击事件。
            var row=block.row
            var col=block.col
            var row3=[row-1,row,row+1]
            var col3=[col-1,col,col+1]
            for(var x=0;x<row3.length;x++){
                if(row3[x]<0||row3[x]>=maxRow)continue;
                for(var y=0;y<col3.length;y++){
                    if(col3[y]<0||col3[y]>=maxCol)continue;
                    if(row3[x]==row&&col3[y]==col)continue;
                    leftClick(row3[x],col3[y])
                }
            }
        }
    }
    //判断游戏是否结束
    var success=true;
    for(var i=0 ;i<blocks.length;i++){
        if(blocks[i].value==-1)continue;
        if(blocks[i].state!='1'){
            success=false;
            break;
        }
    }
    if(success){
        setTimeout(function(){
            alert('您成功了！')
        },200)
    }
}
var rightClick=function(row,col){
    var block=blocks[row*maxCol+col]
    var state=block.state;
    if(state=='1')return;
    if(state=='0'){
        state='2'
    }else if(state=='2'){
        if(markFlag){
            state='3'
        }else{
            state='0'
        }
    }else if(state=='3'){
            state='0'
    }
    block.state=state;
    drawBlock(row,col,state)
}

//禁止右键弹出菜单
document.getElementById("mainDiv").oncontextmenu=function(){
    return false
}
//鼠标事件
document.getElementById("myCanvas").onmouseup=function(ev){
    //获取事件在canvas中发生的位置
    var x, y;
    if (ev.layerX || ev.layerX == 0) {
        x = ev.layerX;
        y = ev.layerY;
    } else if (ev.offsetX || ev.offsetX == 0) { // Opera
        x = ev.offsetX;
        y = ev.offsetY;
    }
    var row=parseInt(x/a)
    var col=parseInt(y/a)
    if(ev.button==0){
        leftClick(row,col)
    }else if(ev.button==2){
        rightClick(row,col)
    }
}


